<!--签到-->
<template>
  <div class="bg">

    <div class="content" v-if="data">
      <LImage class="img-hongbao" :src="Config.img('qd_vtn.png')"></LImage>
      <LImage class="img-yuan" :src="Config.img('qd_yuan.png')"></LImage>
      
      <text class="font52 text1 tCenter">{{'+'+data.vtnAmount}}</text>

      <div class="height20"></div>
      <text class="font42 main-t1 tCenter">{{T('签到成功')}}</text>

      <div class="height20"></div>
      <text class="font26 text3 tCenter">{{T('连续签到15天，VTN奖励加成!!!')}}</text>
      
      <div class="height40"></div>
      <div class="row acenter">
        <template v-for="(item,index) in data.signList">
          <div :class="['line', item.nextVtnAmount ? 'main1' : 'bcolor-huang']" v-bind:key="'line'+index"></div>

          <div class="acenter" v-bind:key="index">
            <div :class="['size', item.nextVtnAmount ? 'main1' : 'bcolor-huang']">
              <text class="font28 text2" v-if="item.nextVtnAmount">{{'+'+item.nextVtnAmount}}</text>
              <LImage class="img-gou" v-else :src="Config.img('qd_gou.png')"></LImage>
            </div>
            <text class="font20 text3">{{item.signTime}}</text>
          </div>
        </template>
    
        <div class="line main1"></div>
        <div class="size-min main1"></div>
      </div>

      <div class="but main-bt1" @click="dismiss">
        <text class="font30 text1">{{T('确认')}}</text>
      </div>

      <div class="height30"></div>
      <div class="row acenter jcenter">
        <text class="font26 text3">{{T('已连续签到')}}</text>
        <text class="font26 color-cheng">{{' '+data.signDay+' '}}</text>
        <text class="font26 text3">{{T('天')}}</text>
      </div>
    </div>
  </div>
</template>

<style src="@/_css/style.css" ></style>
<style scoped>
.bg {
  flex: 1;
  align-items: center;
  justify-content: center;
  background-color:rgba(0,0,0,0.4);
}
.content {
  overflow: hidden;
  background-color: #F0F0F0;
  width:540px;
  border-radius:24px;

  padding-top: 140px;
  padding-bottom: 30px;
}
.img-hongbao {
  position:absolute;
  width:292px;
  height:189px;

  top: 40;
  left: 100;
}
.img-yuan {
  position:absolute;
  width: 518px;
  height: 487px;
  top: 80;
}
.bcolor-huang {
  background-color: #FEDA02;
}
.font52{font-size: 52; line-height: 73px; font-weight: 500}
/******************** 签到进度条 */
.line {
  flex: 1;
  height: 8px;

  margin-top: -40px;
}
.size {
  justify-content: center;
  align-items: center;
  width:60px;
  height:60px;
  border-radius:10px;

  margin-bottom: 10px;
}
.size-min {
  width:40px;
  height:40px;
  border-radius:10px;

  margin-top: -40px;
  margin-right: 10px;
}
.img-gou {
  position:absolute;
  width: 29px;
  height: 20px;
}

/******************** 签到按钮 */
.but {
  align-items: center;
  justify-content: center;
  height:72px;
  border-radius:72px;

  margin-top:30px;
  margin-left: 59px;
  margin-right: 59px;
}
.color-cheng {
  color: #EB973B;
}
</style>

<script>


import jnavigator from "@/_js/navigator";
import jhttps from "@/_js/https";
import jconfig from "@/_js/config";
import jmodal from "@/_js/modal";
import jtime from "@/_js/time";


import I18N from "@/_i18n/i18n";
var T = I18N.t;

export default {
  
  data() {
    return {
      T:T,
      Config:jconfig,

      data:undefined,
      okBarW:0,
    };
  },

  created(){
    this.httpsSignin();
  },

  methods: {

    initData(data) {
      
      var time = jtime.getTime(undefined, 'M/d');
      for (let index = 0; index < data.signList.length; index++) {
        var map = data.signList[index];
        var signTime = jtime.getTime(map.signTime, 'M/d');
        map.signTime = (time == signTime) ? T('今日'): signTime;
      }
      return data;
    },

    /********************** https */
    //签到
    httpsSignin(){
      
      jhttps.postX("systemV2/userSign",{},true,(data)=>{
        if(data.status == 200){
          data = data.data;
          this.data = this.initData(data);
        } else{
          jmodal.toast(data.msg);
        }
      });
    },

    /********************** 点击 */
    //关闭
    dismiss(){
      jnavigator.dismiss();
    },
  }
};
</script>
